<template>
 <view>
   <uni-nav-bar @clickLeft="$ui.back()" dark color="#FFD76B" backgroundColor="#323232" background-color="#007AFF"
     left-icon="left" status-bar title="矿机订单" />
    <view class="list">
      <view class="card"  v-for="(item,index) in list" :key="index" >
        <view class="kuangjidays">
          剩余{{item.tians}}天
        </view>
        <view class="kuangjiname">{{item.title}}</view>
        <view class="kuangjiimg" :style="{backgroundImage:'url('+ `${item.image}` +')'}"></view>
        <view class="kuangjishouyi">
          总收益
          <text class="text"> {{item.income}}</text>
        </view>
        <view class="starttime">
          开始时间：{{item.time.substring(0,16)}}
        </view>
        <view class="endtime">
          结束时间：{{gettimeStamp2String(item.end_time)}}
        </view>
      
      </view>
    </view>
 </view>
</template>

<script>
  import {
    getMemberMiner
  } from '@/api/kuangji/index.js'
  import timeStamp2String from '@/utils/time.js'
  export default {
    data() {
      return {
				list:[],
      }
    },
    onLoad() {
    	// 获取获取矿机列表
      this.getList()
    },
    methods: {
			// 获取抢购记录接口
			getList(){
				// 调用接口
				getMemberMiner({
				}).then(res => {
          this.list = res.data
          console.log('成功res=', res)
				}).catch((e) => {
				}) 
			},
      gettimeStamp2String(val){
        console.log('时间戳转化1=',val)
        let valtime =  val*1000
        return timeStamp2String(valtime,8)
      }
    }
  }
</script>

<style lang="less" scoped>
  .list .card:first-child{
    margin-top: 40rpx;
  }
  .card{
    width: 710rpx;
    height: 236rpx;
    background: #FFFFFF;
    border-radius: 10rpx;
    margin: 0 auto;
    margin-top: 20rpx;
    position: relative;
    overflow: hidden;
    .kuangjidays{
      position: absolute;
      top:20rpx;
      right:40rpx;
      font-size: 30rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: #D6B55E;
    }
    .kuangjiimg{
      position: absolute;
      top:40rpx;
      left: 39rpx;
      width: 134rpx;
      height: 103rpx;
      // background-image: url('@/static/kuangji/img.png');
      background-size: 100% 100%;
      background-repeat: no-repeat;
    }
    .kuangjiname{
      position: absolute;
      top:40rpx;
      left: 200rpx;
      font-size: 30rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: #D6B55E;
    }
    .kuangjishouyi{
      position: absolute;
      top:80rpx;
      left: 200rpx;
      font-size: 26rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: #999999;
      .text{
        font-size: 26rpx;
        font-family: PingFang SC;
        font-weight: bold;
        color: #333333;
      }
    }
    .starttime{
      position: absolute;
      top:120rpx;
      left: 200rpx;
      font-size: 26rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: #999999;
    }
    .endtime{
      position: absolute;
      top:160rpx;
      left: 200rpx;
      font-size: 26rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: #999999;
    }
  }
  
</style>